<div class="create-uhost-view" ng-controller="CreateCloudController as createCloud">
    <div class="create-uhost-view-body">
        <div class="uhost-locals uhost-group">
            <div class="group-text">
                <span>地域</span>
            </div>
            <div class="options-box">
                <div class="options-item">
                    <div class="text">地域：</div>
                    <div class="control">
                        <tabs data-tab-change="createCloud.uhostLocals.tabChange(code)"
                              data-datasets="createCloud.uhostLocals.datasets"
                              data-selected="{{::createCloud.uhostLocals.selected.local}}">
                        </tabs>
                    </div>
                </div>
                <div class="options-item">
                    <div class="text">可用区域：</div>
                    <div class="control">
                        <select class="control-select control-block" ng-model="createCloud.uhostLocals.selected.area">
                            <option value="{{::$index}}" ng-repeat="area in createCloud.uhostLocals.datasets[createCloud.uhostLocals.selected.local].areas track by $index" ng-bind="area.label"></option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <!-- space -->
        <div class="uhost-instance uhost-group">
            <div class="group-text">
                <span>实例</span>
            </div>
            <div class="options-box">
                <div class="options-item">
                    <div class="text">实例规格：</div>
                    <div class="control">
                        <span class="text-large" ng-bind="createCloud.uhostStorage.sysDisk"></span>
                        <span class="text-large" ng-bind="createCloud.uhostStorage.unit"></span>
                    </div>
                </div>
                <div class="options-item">
                    <div class="text">实例选择：</div>
                    <div class="control">
                        <button class="ubtn ubtn-blue ubtn-rect" ng-click="createCloud.uhostStorage.storageAdd()">
                            <span class="ti-plus"></span>
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <!-- space -->
        <div class="uhost-network uhost-group">
            <div class="group-text">
                <span>网络</span>
            </div>
            <div class="options-box">
                <div class="options-item">
                    <div class="text">VPC网络：</div>
                    <div class="control">
                        <select class="control-select control-block" ng-model="createCloud.uhostNetwork.selected.vpcnet">
                            <option value="{{::$index}}" ng-repeat="vpcnet in createCloud.uhostNetwork.datasets track by vpcnet.vpcCiId" ng-bind="vpcnet.vpcNetAddress"></option>
                        </select>
                    </div>
                    <div class="tips">提示：<span>Xdsfasdfasdfasdfasf</span></div>
                </div>
                <div class="options-item">
                    <div class="text">子网：</div>
                    <div class="control">
                        <select class="control-select control-block" ng-model="createCloud.uhostNetwork.selected.subnet">
                            <option value="" >-- 请选择子网 --</option>
                            <option value="{{::$index}}" ng-repeat="subnet in createCloud.uhostNetwork.datasets[createCloud.uhostNetwork.selected.vpcnet].subnets track by subnet.subnetId" ng-bind="subnet.subnetNetAddress"></option>
                        </select>
                    </div>
                    <div class="tips">提示：<span>Xdsfasdfasdfasdfasf</span></div>
                </div>
                <div class="options-item">
                    <div class="text">公网IP：</div>
                    <div class="control">
                        <tabs data-tab-change="createCloud.uhostNetwork.tabChange(code)"
                              data-datasets="createCloud.uhostNetwork.tabsModel"
                              data-selected="{{::createCloud.uhostNetwork.selected.internet}}">
                        </tabs>
                    </div>
                </div>
            </div>
        </div>
        <!-- space -->
        <div class="uhost-bandwidth uhost-group">
            <div class="group-text">带宽</div>
            <div class="options-box">
                <div class="options-item">
                    <div class="text">带宽类型：</div>
                    <div class="control">
                        <tabs data-tab-change="createCloud.uhostBandwidth.tabChange(code)"
                              data-datasets="createCloud.uhostBandwidth.datasets"
                              data-selected="{{::createCloud.uhostBandwidth.selected.tab}}">
                        </tabs>
                    </div>
                </div>
                <div class="options-item">
                    <div class="text">运营商：</div>
                    <div class="control">
                        <select class="control-select control-large" ng-model="createCloud.uhostBandwidth.selected.ISP">
                            <option value="{{::$index}}" ng-repeat="isp in createCloud.uhostBandwidth.datasets[createCloud.uhostBandwidth.selected.tab].netOperators track by $index" ng-bind="isp.label"></option>
                        </select>
                    </div>
                    <div class="tips">提示：<span>Xdsfasdfasdfasdfasf</span></div>
                </div>
                <div class="options-item" ng-show="createCloud.uhostBandwidth.datasets[createCloud.uhostBandwidth.selected.tab].netOperators[createCloud.uhostBandwidth.selected.ISP].bandwidths.length">
                    <div class="text">带宽：</div>
                    <div class="control">
                        <select class="control-select control-block" ng-model="createCloud.uhostBandwidth.selected.type">
                            <option value="{{::$index}}" ng-repeat="type in createCloud.uhostBandwidth.datasets[createCloud.uhostBandwidth.selected.tab].netOperators[createCloud.uhostBandwidth.selected.ISP].bandwidths track by $index" ng-bind="type.ciName"></option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <!-- space -->
        <div class="uhost-iso uhost-group">
            <div class="group-text">镜像</div>
            <div class="options-box">
                <div class="options-item">
                    <div class="text">公共镜像：</div>
                    <div class="control">
                        <select class="control-select control-large"
                                ng-model="createCloud.uhostISO.selected"
                                ng-options="iso.name as iso.cname for iso in createCloud.uhostISO.datasets track by iso.name">
                                <option value="" >-- 请选择镜像 --</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <!-- space -->
        <div class="uhost-storage uhost-group">
            <div class="group-text">存储</div>
            <div class="options-box">
                <div class="options-item">
                    <div class="text">系统盘：</div>
                    <div class="control">50G</div>
                </div>
                <div class="options-item">
                    <div class="text">数据盘：</div>
                    <div class="control">
                        <div class="operate">
                            <button class="ubtn ubtn-blue ubtn-rect" ng-click="createCloud.uhostStorage.storageAdd()">
                                <span class="ti-plus"></span>
                            </button>
                        </div>
                    </div>
                    <div class="control-list">
                        <ul>
                            <li ng-repeat="item in createCloud.uhostStorage.selected track by item._id">
                                <select-rect data-id="{{item._id}}" 
                                            data-select-all="createCloud.uhostStorage.selected" 
                                            data-options="createCloud.uhostStorage.options" />
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!-- space -->
        <div class="uhost-workgroup uhost-group">
            <div class="group-text">业务组</div>
            <div class="options-box">
                <div class="options-item">
                    <div class="text">业务组：</div>
                    <div class="control">
                        <select class="control-select control-block">
                            <option value="01">默认业务组</option>
                            <option value="02">欧冶业务组</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="create-uhost-view-footer">
        <button class="ubtn ubtn-blue control-large" ng-click="createCloud.submit()">确 认</button>
    </div>
</div>